﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>Password Encryption</title>
    <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>
    <script type="text/javascript">
        function Encrypt() {
            var pw = $('#pwdId').val();
            var uriPw = 'api/passwords';

            $.getJSON(uriPw + '/' + pw)
                .done(function (data) {
                    $('#encPwdHdrId').text("Encrypted string:");
                    $('#encPwdId').text(data.encryptedPassword);
                })
                .fail(function (jqXHR, textStatus, err) {
                    $('#encPwdHdrId').text("");
                    if (pw == "") {
                        $('#encPwdId').text('Empty password set');
                    } else {
                        $('#encPwdId').text('Error: ' + err);
                    }
                });
        }
    </script>
</head>
<body>
    <h2>Password Encryption</h2>
    <h3>Given string:</h3>
    <input id="pwdId" type="text" size="45" />
    <input type="button" value="Encrypt" onclick="Encrypt();" />
    <h3 id="encPwdHdrId"></h3>
    <p id="encPwdId"></p>
    <h3><a href="index.html">Home</a></h3>   
</body>
</html>
